<p *ngIf="mod.description !== ''">{{ mod.description }}</p>
<span font="monospace" fxLayout="row wrap">
  <span
    *ngIf="mod.price > 0"
    class="production-color"
    nz-tooltip
    nzTooltipTitle="Price"
    fxLayout="row"
  >
    <i nz-icon nzType="fa-s:wrench"></i>
    <span>{{ mod.price | number: "1.0-0" }}</span>
  </span>
  <span
    *ngIf="mod.damage > 0"
    class="damage-color"
    nz-tooltip
    nzTooltipTitle="Damage"
    fxLayout="row"
  >
    <i nz-icon nzType="my:blaster"></i>
    <span>{{ mod.damage | number: "1.0-0" }}</span>
  </span>
  <span
    *ngIf="mod.armourDamagePercent !== 100"
    class="armour-damage-color"
    nz-tooltip
    nzTooltipTitle="Percent of damage dealt to Armours"
    fxLayout="row"
  >
    <i nz-icon nzType="my:laser-blast"></i>
    {{ mod.armourDamagePercent | number: "1.0-0" }}%
  </span>
  <span
    *ngIf="mod.shieldDamagePercent !== 100"
    class="shield-damage-color"
    nz-tooltip
    nzTooltipTitle="Percent of damage dealt to Shields"
    fxLayout="row"
  >
    <i nz-icon nzType="my:supersonic-bullet"></i>
    {{ mod.shieldDamagePercent | number: "1.0-0" }}%
  </span>

  <span
    *ngIf="mod.armourPen > 0"
    class="armour-damage-color"
    nz-tooltip
    nzTooltipTitle="Ignore armour damage reduction"
    fxLayout="row"
  >
    <i nz-icon nzType="my:laser-blast-minus"></i>
    {{ mod.armourPen | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.shieldPen > 0"
    class="shield-damage-color"
    nz-tooltip
    nzTooltipTitle="Ignore shield damage reduction"
    fxLayout="row"
  >
    <i nz-icon nzType="my:supersonic-bullet-minus"></i>
    {{ mod.shieldPen | number: "1.0-0" }}
  </span>

  <span
    *ngIf="mod.defenceDamagePercent !== 100"
    class="defence-damage-color"
    nz-tooltip
    nzTooltipTitle="Percent of damage dealt to ground defences"
    fxLayout="row"
  >
    <i nz-icon nzType="my:falling-bomb"></i>
    {{ mod.defenceDamagePercent | number: "1.0-0" }}%
  </span>
  <span
    *ngIf="mod.armour > 0"
    class="armour-damage-color"
    nz-tooltip
    nzTooltipTitle="Armour"
    fxLayout="row"
  >
    <i nz-icon nzType="my:metal-scales"></i>
    {{ mod.armour | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.armourPercent > 0"
    class="armour-damage-color"
    nz-tooltip
    nzTooltipTitle="+ Armour %"
    fxLayout="row"
  >
    <i nz-icon nzType="my:metal-scales"></i>
    {{ mod.armourPercent | number: "1.0-0" }}%
  </span>
  <span
    *ngIf="mod.armourDamageReduction > 0"
    class="armour-damage-color"
    nz-tooltip
    nzTooltipTitle="Armour Damage Reduction"
    fxLayout="row"
  >
    <i nz-icon nzType="my:shield-reflect"></i>
    {{ mod.armourDamageReduction | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.shield > 0"
    class="shield-damage-color"
    nz-tooltip
    nzTooltipTitle="Shield"
    fxLayout="row"
  >
    <i nz-icon nzType="my:bubble-field"></i>
    {{ mod.shield | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.shieldPercent > 0"
    class="shield-damage-color"
    nz-tooltip
    nzTooltipTitle="+ Shield %"
    fxLayout="row"
  >
    <i nz-icon nzType="my:bubble-field"></i>
    {{ mod.shieldPercent | number: "1.0-0" }}%
  </span>
  <span
    *ngIf="mod.shieldDamageReduction > 0"
    class="shield-damage-color"
    nz-tooltip
    nzTooltipTitle="Shield Damage Reduction"
    fxLayout="row"
  >
    <i nz-icon nzType="my:shield-reflect"></i>
    {{ mod.shieldDamageReduction | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.shieldRecharge > 0"
    class="shield-damage-color"
    nz-tooltip
    nzTooltipTitle="Shield Recharge"
    fxLayout="row"
  >
    <i nz-icon nzType="my:armor-upgrade"></i>
    {{ mod.shieldRecharge | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.energy !== 0"
    class="energy-color"
    nz-tooltip
    nzTooltipTitle="Energy"
    fxLayout="row"
  >
    <i nz-icon nzType="my:electric"></i>{{ mod.energy | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.explosion !== 0"
    class="explosion-color"
    nz-tooltip
    nzTooltipTitle="Explosion Threshold"
    fxLayout="row"
  >
    <i nz-icon nzType="my:explosion-rays"></i
    >{{ mod.explosion | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.explosionDamage !== 0"
    class="damage-color"
    nz-tooltip
    nzTooltipTitle="Explosion Damage"
    fxLayout="row"
  >
    <i nz-icon nzType="my:explosion-rays"></i
    >{{ mod.explosionDamage | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.terraformer > 0"
    class="habSpace-color"
    nz-tooltip
    nzTooltipTitle="Increase district gains. Total bonus is 'number of ships' * 'cargo bonus'"
    fxLayout="row"
  >
    <i nz-icon nzType="fa-s:globe"></i>{{ mod.terraformer | format }}%
  </span>
  <span
    *ngIf="mod.cargo > 0"
    class="cargo-color"
    nz-tooltip
    nzTooltipTitle="Cargo, increase metal, energy, alloy and components rewards from battle. Stack additive. Total bonus is 'number of ships' * 'cargo bonus'"
    fxLayout="row"
  >
    <i nz-icon nzType="my:cube"></i>{{ mod.cargo | format }}%
  </span>
  <span
    *ngIf="mod.components > 0"
    class="component-color"
    nz-tooltip
    nzTooltipTitle="Components, components rewards from battle. Stack additive. Total bonus is 'number of ships' * 'cargo bonus'"
    fxLayout="row"
  >
    <i nz-icon nzType="fa-s:microchip"></i>{{ mod.components | format }}%
  </span>
  <span
    *ngIf="mod.scienceLab > 0"
    class="science-color"
    nz-tooltip
    nzTooltipTitle="Science lab, increase science and search rewards from battle. Stack additive. Total bonus is 'number of ships' * 'science lab bonus'"
    fxLayout="row"
  >
    <i nz-icon nzType="fa-s:flask"></i>{{ mod.scienceLab | format }}
  </span>
  <span
    *ngIf="mod.velocity > 0"
    class="velocity-color"
    nz-tooltip
    nzTooltipTitle="Velocity, decrease travel time."
    fxLayout="row"
  >
    <i nz-icon nzType="my:rocket-thruster"></i
    >{{ mod.velocity | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.acceleration > 0"
    class="acceleration-color"
    nz-tooltip
    nzTooltipTitle="Acceleration, increase velocity /s^2. Usefully for long travels."
    fxLayout="row"
  >
    <i nz-icon nzType="forward"></i>{{ mod.acceleration | number: "1.0-4" }}
  </span>
  <span
    *ngIf="mod.threat !== 0"
    class="threat-color"
    nz-tooltip
    nzTooltipTitle="Threat, increase fire drawn from enemy if positive, decrease it otherwise."
    fxLayout="row"
  >
    <i nz-icon nzType="my:archery-target"></i>{{ mod.threat | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.threatGainMulti !== 1"
    class="threat-color"
    nz-tooltip
    nzTooltipTitle="Threat Multi, increase or decrease threat gained from damaging enemies."
    fxLayout="row"
  >
    <i nz-icon nzType="my:target-arrows"></i
    >{{ mod.threatGainMulti * 100 | number: "1.0-0" }}%
  </span>
  <span
    *ngIf="mod.precision > 0"
    class="threat-color"
    nz-tooltip
    nzTooltipTitle="Precision, increase chance of targeting alive ships or defences."
    fxLayout="row"
  >
    <i nz-icon nzType="my:targeting"></i>{{ mod.precision | number: "1.0-0" }}
  </span>
  <span
    *ngIf="mod.adaptivePrecision > 0"
    class="threat-color"
    nz-tooltip
    nzTooltipTitle="Adaptive Precision, increase chance of targeting whatever weapons are best at. Bonus is proportional to armour damage%, shield damage % and ground defences damage %"
    fxLayout="row"
  >
    <i nz-icon nzType="my:arrow-scope"></i
    >{{ mod.adaptivePrecision | number: "1.0-0" }}
  </span>
</span>
